#div1{
    width: 20em;
    height: 10em;
    border: black solid 1px;
    background-color: red;
}
/*相对定位*/
#div2{
    width: 20em;
    height: 10em;
    border: lawngreen dashed 1px;
    background-color: orange;
    position: relative;
    left: 1em;
    top:  1em;
}
/*绝对定位*/
#div3{
    width: 20em;
    height: 10em;
    border: blueviolet dot-dash 1px;
    background-color: blue;
    position: absolute;
    left: 1em;
    top:  1em;
}
.fixed-side{
    width: 20em;
    height: 10em;
    border: blueviolet 1px;
    background-color: bisque;
    position: fixed;
    left: 30em;
    top:  10em;
}
.one{
    width: 2em;
    height: 30em;
    border: black solid 1px;
    margin-bottom: 10em;
    overflow: scroll;   //滚动
    /*overfiow: hidden */
}
/*成组显示器*/
.one,.two,.three{

    width: 2em;
    height: 30em;
    border: black solid 1px;
    margin-bottom: 10em;
     overfiow: hidden;
     /*overflow: scroll; */  //滚动
     float: left;
}
.clf{
   clear: both;
}


.four{
    float: left;
    width: 30em;
    height: 2em;
    border: black solid 1px;
    background-color: crimson;
    margin-bottom: 3em;
}